<template>
    <div>
        <el-menu
                style="width: 200px; min-height: calc(100vh - 50px)"
                default-active="path"
                router
                class="el-menu-vertical-demo"
                background-color="#545c64"
                text-color="#fff"
                active-text-color="#ffd04b">
            <el-menu-item index="/home">
                <i class="el-icon-notebook-1"></i>
                <span>首页详情</span>
            </el-menu-item>
            <el-sub-menu index="1">
                <template #title>
                    <i class="el-icon-s-help"></i>
                    <span>系统管理</span></template>
                <el-menu-item index="/user">
                    <i class="el-icon-user"></i>
                    <span>用户管理</span>
                </el-menu-item>
            </el-sub-menu>
            <el-menu-item index="/book">
                <i class="el-icon-notebook-1"></i>
                <span>书籍管理</span>
            </el-menu-item>
            <el-menu-item index="/news">
                <i class="el-icon-news"></i>
                <span>新闻管理</span>
            </el-menu-item>
            <el-sub-menu index="2">
                <template #title>
                    <i class="el-icon-menu"></i>
                    <span>景点管理</span>
                </template>
                <el-menu-item index="/travel">
                    <i class="el-icon-s-data"></i>
                    <span>景点详情</span></el-menu-item>
            </el-sub-menu>
        </el-menu>
    </div>
</template>

<script>
    import request from "../utils/request";

    export default {
        name: "Aside",
        data() {
            return {
                path: this.$router.path,
                user: {}
            }
        },
        methods: {
            async checkUser() {
                const result = await request.get("/user/" + this.user.id)
                if (result === '0') {
                    this.user = result.data
                }
            }
        },
        created() {
            let userStr = sessionStorage.getItem("user") || "{}"
            this.user = JSON.parse(userStr)
            this.checkUser()
        }
    }
</script>

<style scoped>
    .el-menu {
        border-right: none;
    }
</style>
